.root {
  -icons-color: rgb(61, 114, 144);
  -fx-font-size: 10px;
}

.glyph-icon {
  -fx-text-fill: -icons-color;
  -fx-fill: -icons-color;
  -glyph-size: 48px;
}

.glyph-icon:hover {
  -fx-effect: dropshadow(three-pass-box, rgba(0, 0, 0, 0.2), 4, 0, 0, 0);
}

.bluesky-icon {
  -glyph-name: "CLOUD";
  -icons-color: blue;
  -fx-fill: linear-gradient(-icons-color 0%, derive(-icons-color, 100%) 30%, derive(blueviolet, 30%) 85%);
}

.axis-editor-view-pane {
  -fx-background-color: blue;
}

.enlargeButton {
  -fx-icon: bluesky-icon;
  -fx-background-color: red;
  -fx-shape: "M1344 800v64q0 14-9 23t-23 9h-832q-14 0-23-9t-9-23v-64q0-14 9-23t23-9h832q14 0 23 9t9 23zm128 448v-832q0-66-47-113t-113-47h-832q-66 0-113 47t-47 113v832q0 66 47 113t113 47h832q66 0 113-47t47-113zm128-832v832q0 119-84.5 203.5t-203.5 84.5h-832q-119 0-203.5-84.5t-84.5-203.5v-832q0-119 84.5-203.5t203.5-84.5h832q119 0 203.5 84.5t84.5 203.5z";
}

.icons:hover {
  -fx-effect: dropshadow(three-pass-box, derive(-icons-color, 0%), 0.01em, 0.0, 0, 0);
}
